<template>
  <div class="detail-container">
    <!-- <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
    </van-pull-refresh>-->
    <h1 class="tit">{{ list.title }}</h1>
    <p class="time">{{ list.time }}</p>
    <img :src="list.image" class="showimg">
    <span class="content">{{ list.content }}</span>
  </div>
</template>
<script>
export default {
  data() {
    return {
      isLoading: false,
      list: [],
      tit: "玩儿金融，不可不知的金融杠杆！",
      time: "2018-12-02 12.22",
      content:
        "如果你是来自 React 的开发者，你可能会对 Vuex 和 Redux 间的差异表示关注，Redux 是 React 生态环境中最流行的 Flux 实现。Redux 事实上无法感知视图层，所以它能够轻松的通过一些简单绑定和 Vue 一起使用。Vuex 区别在于它是一个专门为 Vue 应用所设计。这使得它能够更好地和 Vue 进行整合，同时提供简洁的 API 和改善过的开发体验。"
    };
  },
  beforeCreate: function() {
    //创建前
  },
  // 下面的是缓存离开的时候
  deactivated() {},
  // 下面的是缓存进去的时候
  activated() {
    let that = this;
    that.$toast.loading({
      message: "加载中..."
    });
    var Sukdata = {};
    console.log(Sukdata);
    that.axios
      .post(that.baseUrl + "/notice/getNotice", that.Qs.stringify(Sukdata), {
        headers: {
          "Content-Type": "application/x-www-form-urlencoded"
        }
      })
      .then(function(res) {
        if (res.request.status === 200) {
          console.log(res.data);
          if (res.data.meta.code == 200) {
            let index = that.$route.params.index;
            that.list = res.data.data[index];
            that.$toast.clear();
            console.log(that.list, 123);
          } else if (res.data.meta.code == 501) {
          }
        }
      });
  },
  created: function() {
    //创建后
  },
  beforeMount: function() {
    //挂载前
  },
  mounted: function() {
    //挂载后
  },
  beforeUpdate: function() {
    //更新前
  },
  update: function() {
    //更新后
  },
  methods: {
    // onRefresh() {
    //   setTimeout(() => {
    //     this.$toast.loading('刷新成功');
    //     this.isLoading = false;
    //     this.count++;
    //   },1 );
    // }
  }
  // destoryed(){

  // }
};
</script>
<style lang="scss" scoped>
.detail-container {
  width: 90%;
  margin: 0 auto;
  font-size: 0.3rem;
  margin-top: 15px;
  .tit {
    font-size: 19px;
    font-weight: 500;
  }
  .time {
    text-align: right;
    color: #a0a0a0;
    margin-bottom: 10px;
    border-bottom: 1px solid #f4f4f4;
  }
  .content {
    display: inline;
    text-indent: 30px;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 2px;
    white-space: pre-wrap;
  }
}

.showimg {
  width: 200px;
  height: 110px;
  float: left;
  margin-right: 10px;
}
</style>
